<template>
  <div class="home page-tab">
    <Navbar style="position:absolute;top:0;z-index:99999" :appTitle="title" :rtitle="rtitle" :rname="rname" />
    <qrcode
      :qrcode="formData.qrcode"
      :showClose="formData.showClose"
      v-show="formData.qrcode"
      :camera="camera"
      :torchActive="torchActive"
      @switchCamera="switchCamera"
      @ClickFlash="ClickFlash"
      @turnCameraOff="turnCameraOff"
      @onDecode="onDecode"
      @onInit="onInit"
    />
    <TabBar></TabBar>
  </div>
</template>

<script>
import Navbar from "@/components/navBar/navBar_right";
import TabBar from "@/components/TabBar";
export default {
  name: "Home",
  components: { Navbar, TabBar, qrcode: () => import("@/components/scanCode") },
  data() {
    return {
      title: "生产报工",
      rtitle: "",
      rname: "", //search
      formData: {
        qrcode: false,
        showClose: false,
      },
      torchActive: true,
      camera: "off",
    };
  },
  computed: {},
  mounted() {},
  created() {
    this.clickCode();
  },
  methods: {
    // 打开相机
    clickCode() {
      let that = this;
      try {
        //入参
        var opt = {
          success: function (res) {
            console.log(JSON.stringify(res),'APP扫码数据')
            if (res.retCode == 0) {
              that.onDecode(res.retData);
            } else {
              that.$toast(res.retMsg);
            }
          },
          fail: function (err) {
            that.$toast('扫码失败！');
          },
        };
        //插件调用代码
        WorkHelper.scan(opt);
      } catch (e) {
        // camera:: 'front'--前摄像头，'rear'后摄像头，'off'关闭摄像头，会获取最后一帧显示，'auto'开始获取摄像头
        that.formData.qrcode = true;
        that.camera = "rear";
      }
    },
    // 扫码结果回调
    onDecode(result) {
      // result, 扫描结果，可以根据自己的需求来实现相应的功能
      console.log(result, "扫码结果");
      this.$router.push({
        path: "/productTask/report",
        query: {
          orderId: result,
          formPage: "scanCode",
        },
      });
      this.formData.code = result;
    },
    // 相机反转
    switchCamera() {
      switch (this.camera) {
        case "front":
          this.camera = "rear";
          break;
        case "rear":
          this.camera = "front";
          break;
        default:
          this.$toast("错误");
      }
    },
    // 关闭相机
    turnCameraOff() {
      this.camera = "off";
      this.formData.qrcode = false;
    },
    // 打开手电筒
    ClickFlash() {
      switch (this.torchActive) {
        case true:
          this.torchActive = false;
          break;
        case false:
          this.torchActive = true;
          break;
        default:
          this.$toast("错误");
      }
    },

    // 检查是否调用摄像头
    async onInit(promise) {
      try {
        await promise;
      } catch (error) {
        if (error.name === "StreamApiNotSupportedError") {
        } else if (error.name === "NotAllowedError") {
          this.errorMessage = "Hey! I need access to your camera";
        } else if (error.name === "NotFoundError") {
          this.errorMessage = "Do you even have a camera on your device?";
        } else if (error.name === "NotSupportedError") {
          this.errorMessage =
            "Seems like this page is served in non-secure context (HTTPS, localhost or file://)";
        } else if (error.name === "NotReadableError") {
          this.errorMessage =
            "Couldn't access your camera. Is it already in use?";
        } else if (error.name === "OverconstrainedError") {
          this.errorMessage =
            "Constraints don't match any installed camera. Did you asked for the front camera although there is none?";
        } else {
          this.errorMessage = "UNKNOWN ERROR: " + error.message;
        }
      }
    },
  },
};
</script>
<style lang="scss" scoped>
</style>